---
sidebar_position: 6
---

# Accessibility

DayPicker is designed to adhere to the [ARIA Authoring Practices Guide](https://www.w3.org/WAI/ARIA/apg/patterns/dialog-modal/examples/datepicker-dialog/) for date pickers. This includes features such as keyboard navigation, focus management, and labeling.

Depending on your design, you may need to add new accessibility features. For instance, when working with [Input Fields](../advanced-guides/input-fields.mdx), there could be some restrictions depending on the level of accessibility you aim to achieve. Stay updated with the best practices by following the [ARIA Patterns](https://www.w3.org/WAI/ARIA/apg/patterns/).

## ARIA Labels Translation

When translating the date picker to another language, it's necessary to update the ARIA labels to match the new language. Refer to [Localization](../using-daypicker/localization.mdx#aria-labels) for more information.

## Keyboard Navigation

| Keys                         | Function                            |
| ---------------------------- | ----------------------------------- |
| <kbd>Arrow Top</kbd>         | Move focus to the previous week     |
| <kbd>Arrow Right</kbd>       | Move focus to the next day          |
| <kbd>Arrow Bottom</kbd>      | Move focus to the next week         |
| <kbd>Arrow Left</kbd>        | Move focus to the previous day      |
| <kbd>Page Up</kbd>           | Move focus to the previous month    |
| <kbd>Page Down</kbd>         | Move focus to the next month        |
| <kbd>Shift + Page Up</kbd>   | Move focus to the previous year     |
| <kbd>Shift + Page Down</kbd> | Move focus to the next year         |
| <kbd>Home</kbd>              | Move focus to the start of the week |
| <kbd>End</kbd>               | Move focus to the end of the week   |
| <kbd>Enter/Space</kbd>       | Select the focused day              |

## Reporting Issues With Accessibility

Accessibility is a field that is constantly evolving. If you encounter any issues with DayPicker, please [open an issue](https://github.com/gpbl/react-day-picker/issues/new/choose) or share
your feedback to help make the library more accessible.

See also the [existing accessibility issues](https://github.com/gpbl/react-day-picker/issues?q=is%3Aopen+label%3Aaccessibility+sort%3Aupdated-desc).
